<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    <meta name="viewport" content="width=device-width, initial-scale=1"/>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <title>Title</title>
    <script type="text/javascript" src="js/jquery-3.5.1.min.js"></script>
    <link href="bootstrap/css/bootstrap.css" rel="stylesheet">
    <script src="bootstrap/js/bootstrap.js"></script>
    <script src="bootstrap/js/bootstrap-paginator.js"></script>
</head>
<body>

<div class="container">
    <div th:replace="common/head.html"></div>
    <div th:replace="common/menu.html"></div>
    <div th:replace="common/nav.html"></div>

    <script th:inline="javascript">
        var uName = [[${session?.userInfo?.Name}]];
    </script>

    <form action="javascript:void(0)" class="row-fluid" id="modifyPwdForm">
        <div class="row-fluid d-flex justify-content-around">
            <div class="col-4">
                <div>
                    <label for="inpName" class="col-form-label">用户名</label>
                    <input type="text" class="form-control" name="uName" id="inpName" th:value="${session?.userInfo?.Name}" readonly>
                </div>
            </div>
        </div>

        <div class="row-fluid d-flex justify-content-around">
            <div class="col-4">
                <div>
                    <label for="inpOldPwd" class="col-form-label">原密码</label>
                    <input type="password" class="form-control" name="oldPwd" id="inpOldPwd" required>
                </div>
            </div>
        </div>

        <div class="row-fluid d-flex justify-content-around">
            <div class="col-4">
                <div>
                    <label for="inpNewPwd" class="col-form-label">新密码</label>
                    <input type="password" class="form-control" name="NewPwd" id="inpNewPwd" required>
                </div>
            </div>
        </div>

        <div class="row-fluid d-flex justify-content-around">
            <div class="col-4">
                <div>
                    <label for="inpNewPwdRepeat" class="col-form-label">确认新密码</label>
                    <input type="password" class="form-control" name="NewPwdRepeat" id="inpNewPwdRepeat" required>
                </div>
            </div>
        </div>

        <div class="row-fluid d-flex justify-content-center" style="margin: 20px 0">
            <div class="col-1">
                <div>
                    <input class="btn btn-success" type="submit" value="保存">
                </div>
            </div>
            <div class="col-1">
                <div>
                    <input class="btn btn-primary backBtn" type="button" value="返回">
                </div>
            </div>
            <div class="col-1">
                <div>
                    <input class="btn btn-danger" type="reset" value="重置">
                </div>
            </div>
        </div>
    </form>
</div>

<div class="modal fade" tabindex="-1" role="dialog" id="inpErr">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">请完善信息</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <p>两次新密码不一致，请重新输入！</p>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-danger" data-dismiss="modal">关闭</button>
            </div>
        </div>
    </div>
</div>

<div class="modal fade" tabindex="-1" role="dialog" id="nullUserErr">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">用户不存在</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <p>被修改的用户不存在，请重新登录后再试！</p>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-danger" data-dismiss="modal">关闭</button>
            </div>
        </div>
    </div>
</div>

<div class="modal fade" tabindex="-1" role="dialog" id="pwdNotEqualErr">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">旧密码不一致</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <p>旧密码不一致，请核对</p>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-danger" data-dismiss="modal">关闭</button>
            </div>
        </div>
    </div>
</div>


<div class="modal fade" tabindex="-1" role="dialog" id="DBErr">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">数据库错误</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <p>数据库写入数据时出现问题，请联系管理员进行维护！</p>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-danger" data-dismiss="modal">关闭</button>
            </div>
        </div>
    </div>
</div>

<div class="modal fade" tabindex="-1" role="dialog" id="sucModal">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">操作成功</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <p>密码被成功修改！</p>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-success" data-dismiss="modal">关闭</button>
            </div>
        </div>
    </div>
</div>
</body>

<script src="js/modPwd.js"></script>

</html>